<template>
  <div class="test-routing">
    <h1>路由测试页面</h1>
    <p>点击下面的按钮测试路由跳转功能</p>
    <button @click="goToDiagnosis">跳转到医生诊疗页面</button>
    <button @click="goToPatient">跳转到患者查看页面</button>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router'

const router = useRouter()

const goToDiagnosis = () => {
  console.log('准备跳转到医生诊疗页面...')
  const result = router.push({
    path: '/doctor/diagnosis',
    query: { patientId: 'test123' }
  })
  console.log('路由跳转结果:', result)
}

const goToPatient = () => {
  console.log('准备跳转到患者查看页面...')
  const result = router.push('/doctor/patient')
  console.log('路由跳转结果:', result)
}
</script>

<style scoped>
.test-routing {
  padding: 20px;
  text-align: center;
}

button {
  margin: 10px;
  padding: 8px 16px;
  background-color: #409eff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

button:hover {
  background-color: #66b1ff;
}
</style>